/*初始化函数*/
function init() {
    let layer = layui.layer;
    // 初始化字典列表
    $.get("/dic/info", {"token": localStorage.getItem("token")}, function (result) {
        if (result.code === 200) {
            let html_str = "";
            $.each(result.data, function (i, n) {
                html_str += '<tr><td><input type="checkbox" name="dic_type" dic_type_id="' + n.dicTypeId + '" dic_value_id="' + n.dicValueId + '" value=""></td>';
                html_str += '<td>' + n.dicTypeName + '</td>';
                html_str += '<td>' + n.dicTypeDescription + '</td>';
                html_str += '<td><input type="radio" name="dic_value" dic_type_id="' + n.dicTypeId + '" dic_value_id="' + n.dicValueId + '" value=""></td>';
                html_str += '<td>' + n.dicValueName + '</td>';
                html_str += '<td>' + n.value + '</td></tr>';
            })
            $("#dic_list").html(html_str);
        } else if (result.code === 401)
            window.parent.location.href = "/login.html";
        else
            layer.msg(result.msg, {icon: 5});
        layer.closeAll("loading");
    })
    // 初始化类型下拉框
    $.get("/dic/type", {"token": localStorage.getItem("token")}, function (result) {
        if (result.code === 200) {
            let html_str = '<option value=""></option>';
            $.each(result.data, function (i, n) {
                html_str += '<option value="' + n.id + '">' + n.name + '</option>';
            })
            $("select[name='dic_type_id']").html(html_str);
        } else layer.msg(result.msg, {icon: 5});
    })
}

layui.use(['layer', 'form'], function () {
    let layer = layui.layer, form = layui.form;

    // 0.绑定复选框
    $("#dic_list").on("click", "input[type='checkbox'][name='dic_type']", function () {
        let $type_checked = $("input[type='checkbox'][name='dic_type']:checked");
        if (this.checked && $type_checked.length > 1) {
            $type_checked.prop("checked", false);
            this.checked = true;
        }
        // 将相同类型的全部选上或取消
        $("input[type='checkbox'][name='dic_type'][dic_type_id='" + $(this).attr("dic_type_id") + "']").prop("checked", this.checked);
    })

    // 1.增加按钮
    $("#add_btn").click(function () {
        let value_flag = $("input[type='checkbox'][name='switch']").prop("checked");
        // 1.1 字典类型操作
        if (value_flag === false) {
            let add_layer_index = layer.open({
                type: 1,
                title: "增加",
                content: $("#add_edit_type_layer"),
                closeBtn: 2,
                anim: 3,
                success: function (layero, index) {
                    $("#reset_btn").click();//清空值
                    $("#add_edit_type_layer").prop("hidden", false);
                },
                end: function () {
                    $("#add_edit_type_layer").prop("hidden", true).attr("style", "");
                }
            })
            // 1.1.1提交按钮
            form.on('submit(type_form_submit)', function (data) {
                //console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
                //console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
                //console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
                let insert_load_index = layer.load(1);
                $.post("/dic/type", {
                    "token": localStorage.getItem("token"),
                    "name": $.trim(data.field.name),
                    "description": $.trim(data.field.description)
                }, function (result) {
                    if (result.code === 200) {
                        let html_str = "";
                        $.each(result.data, function (i, n) {
                            html_str += '<tr><td><input type="checkbox" name="dic_type" dic_type_id="' + n.dicTypeId + '" dic_value_id="' + n.dicValueId + '" value=""></td>';
                            html_str += '<td>' + n.dicTypeName + '</td>';
                            html_str += '<td>' + n.dicTypeDescription + '</td>';
                            html_str += '<td><input type="radio" name="dic_value" dic_type_id="' + n.dicTypeId + '" dic_value_id="' + n.dicValueId + '" value=""></td>';
                            html_str += '<td>' + n.dicValueName + '</td>';
                            html_str += '<td>' + n.value + '</td></tr>';
                        })
                        $("#dic_list").prepend(html_str);
                        layer.close(add_layer_index);
                        layer.msg(result.msg, {icon: 1});
                    } else
                        layer.msg(result.msg, {icon: 5});
                    layer.close(insert_load_index);
                })
                return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
            });
        }
        // 1.2 字典值操作
        else if (value_flag === true) {
            let add_layer_index = layer.open({
                type: 1,
                title: "增加",
                content: $("#add_edit_value_layer"),
                closeBtn: 2,
                //anim: 3,
                success: function (layero, index) {
                    $("#value_reset_btn").click();//清空值
                    $("select[name='dic_type_id']").prop("disabled", false);
                    $("#add_edit_value_layer").prop("hidden", false);
                },
                end: function () {
                    $("#add_edit_value_layer").prop("hidden", true).attr("style", "");
                }
            })
            // 1.2.1提交按钮
            form.on('submit(value_form_submit)', function (data) {
                //console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
                //console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
                //console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
                let insert_load_index = layer.load(1);
                $.post("/dic/value", {
                    "token": localStorage.getItem("token"),
                    "dic_type_id": data.field.dic_type_id,
                    "name": $.trim(data.field.value_name),
                    "value": $.trim(data.field.value)
                }, function (result) {
                    if (result.code === 200) {
                        let html_str = "";
                        $.each(result.data, function (i, n) {
                            html_str += '<tr><td><input type="checkbox" name="dic_type" dic_type_id="' + n.dicTypeId + '" dic_value_id="' + n.dicValueId + '" value=""></td>';
                            html_str += '<td>' + n.dicTypeName + '</td>';
                            html_str += '<td>' + n.dicTypeDescription + '</td>';
                            html_str += '<td><input type="radio" name="dic_value" dic_type_id="' + n.dicTypeId + '" dic_value_id="' + n.dicValueId + '" value=""></td>';
                            html_str += '<td>' + n.dicValueName + '</td>';
                            html_str += '<td>' + n.value + '</td></tr>';
                        })
                        $("input[type='checkbox'][name='dic_type'][dic_type_id='" + data.field.dic_type_id + "']").parent().parent().remove();
                        $("#dic_list").prepend(html_str);
                        layer.close(add_layer_index);
                        layer.msg(result.msg, {icon: 1});
                    } else
                        layer.msg(result.msg, {icon: 5});
                    layer.close(insert_load_index);
                })
                return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
            });
        }

    })

    // 2.修改按钮
    $("#edit_btn").click(function () {
        let value_flag = $("input[type='checkbox'][name='switch']").prop("checked");

        // 2.1 操作字典类型
        if (value_flag === false) {
            let $type_checked = $("input[type='checkbox'][name='dic_type']:checked");
            if ($type_checked.length === 0) {
                layer.msg("请选择需要修改的类型", {icon: 5});
                return false;
            }
            let edit_layer_index = layer.open({
                type: 1,
                title: "修改",
                content: $("#add_edit_type_layer"),
                closeBtn: 2,
                anim: 3,
                success: function (layero, index) {
                    $("input[name='name']").val($type_checked.first().parent().next().html());//初始化值
                    $("input[name='description']").val($type_checked.first().parent().next().next().html());//初始化值
                    $("#add_edit_type_layer").prop("hidden", false);
                },
                end: function () {
                    $("#add_edit_type_layer").prop("hidden", true).attr("style", "");
                }
            })
            // 2.1.1提交按钮
            form.on('submit(type_form_submit)', function (data) {
                //console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
                //console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
                //console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
                let update_load_index = layer.load(1);
                $.ajax({
                    url: "/dic/type",
                    method: "put",
                    data: {
                        "token": localStorage.getItem("token"),
                        "id": $type_checked.attr("dic_type_id"),
                        "name": $.trim(data.field.name),
                        "description": $.trim(data.field.description)
                    },
                    dataType: "JSON",
                    success: function (result) {
                        if (result.code === 200) {
                            let html_str = "";
                            $.each(result.data, function (i, n) {
                                html_str += '<tr><td><input type="checkbox" name="dic_type" dic_type_id="' + n.dicTypeId + '" dic_value_id="' + n.dicValueId + '" value=""></td>';
                                html_str += '<td>' + n.dicTypeName + '</td>';
                                html_str += '<td>' + n.dicTypeDescription + '</td>';
                                html_str += '<td><input type="radio" name="dic_value" dic_type_id="' + n.dicTypeId + '" dic_value_id="' + n.dicValueId + '" value=""></td>';
                                html_str += '<td>' + n.dicValueName + '</td>';
                                html_str += '<td>' + n.value + '</td></tr>';
                            })
                            $type_checked.parent().parent().after(html_str);
                            $type_checked.parent().parent().remove();
                            layer.close(edit_layer_index);
                            layer.msg(result.msg, {icon: 1});
                        } else
                            layer.msg(result.msg, {icon: 5});
                        layer.close(update_load_index);
                    }
                })
                return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
            });
        }

        // 2.2 操作字典值
        else if (value_flag === true) {
            let $value_checked = $("input[type='radio'][name='dic_value']:checked");
            if ($value_checked.length !== 1) {
                layer.msg("请选择需要修改的字典值", {icon: 5});
                return false;
            }
            if ($value_checked.attr("dic_value_id") === "null") {
                layer.msg("字典值为null代表此字典类型没有字典值，无法对字典值进行修改哦", {icon: 5});
                return false;
            }
            let edit_layer_index = layer.open({
                type: 1,
                title: "修改",
                content: $("#add_edit_value_layer"),
                closeBtn: 2,
                //anim: 3,
                success: function (layero, index) {
                    $("#value_reset_btn").click();//清空值
                    $("select[name='dic_type_id']").val($value_checked.attr("dic_type_id")).prop("disabled", true);
                    $("input[name='value_name']").val($value_checked.parent().next().html());//初始化值
                    $("input[name='value']").val($value_checked.parent().next().next().html());//初始化值
                    $("#add_edit_value_layer").prop("hidden", false);
                },
                end: function () {
                    $("#add_edit_value_layer").prop("hidden", true).attr("style", "");
                }
            })
            // 2.2.1提交按钮
            form.on('submit(value_form_submit)', function (data) {
                //console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
                //console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
                //console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
                let update_load_index = layer.load(1);
                $.ajax({
                    url: "/dic/value",
                    method: "put",
                    data: {
                        "token": localStorage.getItem("token"),
                        "id": $value_checked.attr("dic_value_id"),
                        "name": $.trim(data.field.value_name),
                        "value": $.trim(data.field.value)
                    },
                    dataType: "JSON",
                    success: function (result) {
                        if (result.code === 200) {
                            $value_checked.parent().next().html(data.field.value_name);
                            $value_checked.parent().next().next().html(data.field.value);
                            layer.close(edit_layer_index);
                            layer.msg(result.msg, {icon: 1});
                        } else
                            layer.msg(result.msg, {icon: 5});
                        layer.close(update_load_index);
                    }
                })
                return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
            });
        }

    })


    // 3.删除按钮
    $("#delete_btn").click(function () {
        let value_flag = $("input[type='checkbox'][name='switch']").prop("checked");
        // 3.1 操作字典类型
        if (value_flag === false) {
            let $type_checked = $("input[type='checkbox'][name='dic_type']:checked");
            if ($type_checked.length === 0) {
                layer.msg("请选择需要删除的类型", {icon: 5});
                return false;
            }
            layer.confirm("确认删除 " + $type_checked.first().parent().next().html() + " 类型吗", {
                icon: 3,
                title: "警告"
            }, function (index) {
                let delete_load_index = layer.load(1);
                $.ajax({
                    url: "/dic/type",
                    method: "delete",
                    data: {
                        "token": localStorage.getItem("token"),
                        "id": $type_checked.attr("dic_type_id")
                    },
                    dataType: "json",
                    success: function (result) {
                        if (result.code === 200) {
                            $type_checked.parent().parent().remove();
                            layer.close(index);
                            layer.msg(result.msg, {icon: 1});
                        } else
                            layer.msg(result.msg, {icon: 5});
                        layer.close(delete_load_index);
                    }
                })
            })
        }
        // 3.2 操作字典值
        else if(value_flag===true){
            let $value_checked = $("input[type='radio'][name='dic_value']:checked");
            if ($value_checked.length !== 1) {
                layer.msg("请选择需要删除的字典值", {icon: 5});
                return false;
            }
            if ($value_checked.attr("dic_value_id") === "null") {
                layer.msg("字典值为null代表此字典类型没有字典值，无法对字典值进行删除哦", {icon: 5});
                return false;
            }
            layer.confirm("确认删除 " + $value_checked.parent().prev().prev().html() + " 类型的 "+$value_checked.parent().next().html()+" 值吗", {
                icon: 3,
                title: "警告"
            }, function (index) {
                let delete_load_index = layer.load(1);
                $.ajax({
                    url: "/dic/value",
                    method: "delete",
                    data: {
                        "token": localStorage.getItem("token"),
                        "id": $value_checked.attr("dic_value_id")
                    },
                    dataType: "json",
                    success: function (result) {
                        if (result.code === 200) {
                            $value_checked.parent().parent().remove();
                            layer.close(index);
                            layer.msg(result.msg, {icon: 1});
                        } else
                            layer.msg(result.msg, {icon: 5});
                        layer.close(delete_load_index);
                    }
                })
            })
        }
    })

    // 开始初始化
    init();
})